<template>
  <div class="choose-options">
    设备ID：
    <a-auto-complete
      v-model="id"
      :data-source="dataSource"
      @search="onSearch"
      @change="onChange"
      style="margin-right: 20px"
    />

    日期：从 <a-date-picker @change="getBegin" placeholder="起始日期" /> 到
    <a-date-picker @change="getEnd" placeholder="截止日期" />
    <a-button type="primary" @click="comfirm">查询</a-button>
  </div>
</template>

<script>
export default {
  components: {},
  props: [],
  data() {
    return {
      id: "",
      dataSource: [],
      idData: [],

      beginTime: "",
      endTime: "",
    };
  },
  mounted() {
    this.getLockId();
  },
  methods: {
    // 获取门锁ID列表
    async getLockId() {
      const data = {
        username: this.$_cookie.getCookie("user"),
      };
      const res = await this.$_api.getLockByUsername(data);
      const idArr = res.data.data.list;
      idArr.forEach((item) => {
        this.idData.push(item.identityId);
      });
    },
    getBegin(date, dataString) {
      this.beginTime = dataString;
    },
    getEnd(data, dataString) {
      this.endTime = dataString;
    },
    // 自动填充
    onSearch(searchText) {
      this.dataSource = this.idData;
      let reg = RegExp(this.id);
      this.dataSource = [];
      this.idData.forEach((item) => {
        if (reg.exec(item)) {
          this.dataSource.push(item);
        }
      });
    },

    async comfirm() {
      // 先判断是不是名下的锁，如果是的话给数据，不是就提示
      const data = {
        identityId: this.id,
        username: this.$_cookie.getCookie("user"),
      };
      const res = await this.$_api.checkLockOfUser(data);
      const msg = res.data.message;
      if (msg == "该设备不属于该用户") {
        this.$message.warning("设备不属于用户，无法查询相关信息！");
      } else {
        const value = {
          identityId: this.id,
          timestart: this.beginTime,
          timeend: this.endTime,
        };
        this.$emit("getData", value);
      }
    },
    // input改变的时候
    onChange(value) {
      this.dataSource = this.idData;
      let reg = RegExp(this.id);
      this.dataSource = [];
      this.idData.forEach((item) => {
        if (reg.exec(item)) {
          this.dataSource.push(item);
        }
      });
    },
  },
};
</script>
<style scoped>
.choose-options button {
  margin-left: 20px;
}
</style>
